<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>个人信息</title>
	<meta name="renderer" content="webkit">	
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">	
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">	
	<meta name="apple-mobile-web-app-status-bar-style" content="black">	
	<meta name="apple-mobile-web-app-capable" content="yes">	
	<meta name="format-detection" content="telephone=no">	
	<link rel="stylesheet" type="text/css" th:href="@{/static/common/layui/css/layui.css}" media="all">
	<link rel="stylesheet" type="text/css" th:href="@{/static/common/bootstrap/css/bootstrap.css}" media="all">
	<link rel="stylesheet" type="text/css" th:href="@{/static/common/global.css}" media="all">
	<link rel="stylesheet" type="text/css" th:href="@{/static/css/personal.css}" media="all">
</head>
<body>
<input hidden type="text" id="roomId" th:value="${obj.id}">
<section class="layui-larry-box">
	<div class="larry-personal">
		<!--<header class="larry-personal-tit">-->
			<!--<span>菜品编辑</span>-->
		<!--</header>&lt;!&ndash; /header &ndash;&gt;-->
		<div class="larry-personal-body clearfix">
			<form class="layui-form col-lg-5" action="" method="post">
				<div class="layui-form-item">
					<label class="layui-form-label">房间名称</label>
					<div class="layui-input-block">
						<input type="text" th:value="${obj.roomName}" lay-verify="required" id="roomName" placeholder="请输入" name="roomName" autocomplete="off" class="layui-input">
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">选择办公楼栋</label>
					<div class="layui-input-block">
						<select id="officeId" name="officeId" lay-filter="aihao">
							<option th:each="item,stat : ${list}" th:selected="${obj.officeId} == ${item.id} ? true : false" th:value="${item.id}" th:text="${item.officeBuildingName}"></option>
						</select>
					</div>
				</div>


				<div class="layui-form-item">

					<input id="tag_info_input" hidden th:value="${obj.tagInfo}">
					<div id="tag_btn_div" class="layui-inline">
						<div class="layui-btn-inline">
							<button type="button" id="tag_add" class="layui-btn">添加标签</button>
						</div>
					</div>
				</div>

				<div id="submit_btn_div" class="layui-form-item">
					<div class="layui-input-block">
						<button id="submit_btn" type="button" class="layui-btn">立即提交</button>
						<button id="clear_btn" type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>

			</form>
		</div>
	</div>
</section>
<script type="text/javascript" th:src="@{/static/js/jquery-1.9.1.min.js}"></script>
<script type="text/javascript" th:src="@{/static/common/layui/layui.js}"></script>
<script type="text/javascript">
	layui.use(['form','upload','layedit','jquery','layer'],function(){
        var $ = layui.$;
        var layer = layui.layer;

        var tagString = $("#tag_info_input").val();
        var tagStrArr = tagString.split(",");
        var html = '';
        for (var i =0; i<tagStrArr.length; i++){

            if (tagStrArr[i] != null && tagStrArr[i] != '') {
                if (i==0){
                    html += '<div class="layui-inline">' +
                        '<label class="layui-form-label">功能标签</label>'+
                        '<div class="layui-input-inline">' +
                        '<input type="text" name="tagInfo" lay-verify="required" placeholder="请输入" autocomplete="off" value="'+tagStrArr[i]+'" class="layui-input">' +
                        '</div>' +
                        '</div>';
                } else {
                    html += '<div class="layui-inline">' +
                        '<div class="layui-input-inline">' +
                        '<input type="text" name="tagInfo" lay-verify="required" placeholder="请输入" autocomplete="off" value="'+tagStrArr[i]+'" class="layui-input">' +
                        '</div>' +
                        '</div>';
                }
            }
        }
        $("#tag_btn_div").before(html);




        $("#tag_add").on("click",function () {
            var html = '<div class="layui-inline">' +
                		'<div class="layui-input-inline">' +
                			'<input type="text" name="tagInfo" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">' +
                		'</div>' +
                		'</div>';
            $("#tag_btn_div").before(html);
        });



        $("#submit_btn").on("click",function () {
            //提交按钮
			var id = $("#roomId").val();
            var roomName = $("#roomName").val();
            var officeId = $("#officeId").val();
            var tagInfo = [];
            $("input[name='tagInfo']").each(function () {
                tagInfo.push($(this).val());
            });
            $.ajax({
                url:"/mapmanagement/map/officeRoomInfos/edit",
                data:{
                    'id': id,
                    'roomName': roomName,
                    'officeId':officeId,
                    "tagInfo":tagInfo
                },
                method:'post',
                dataType:'json',
                traditional:true,
                success: function (data) {
                    console.log(data);
                    if (data.code == 500){
                        layer.alert(data.msg, function () {
                            layer.close(layer.index);
                        });
					} else {
                        layer.alert(data.msg, function () {
                            layer.close(layer.index);
                            window.location.reload();
                        });
					}
                },
                error:function () {
                    layer.alert("办公楼更新失败", function () {
                        layer.close(layer.index);
                    });
                }
            })
        });
	});





</script>
</body>
</html>